<template>
    <el-dialog v-model="dialogVisible" title="添加数据集" width="60%" :before-close="() => (dialogVisible = false)">
	<div class="dataForm">
        <CustomTableTwo
            id="groupLeft"
            class="list"
            :search-callback="searchCallback"
            :table-config="tableConfig"
            :isShowPagination="false"
			@selectionChange="groupSelectionChange"
        />
       
        <!-- <div class="btns">
            <el-button @click="$router.back()">取消</el-button>
            <el-button :loading="isSaveLoading" type="primary" @click="onSave">确认添加</el-button>
        </div> -->
	</div>
    <template #footer>
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" :loading="isSaveLoading" @click="onSave">确认添加</el-button>
    </template>
    </el-dialog>
</template>
<script setup lang="ts">
	import type { Department } from '@/types/system';
	import { ref, reactive, getCurrentInstance } from 'vue';
	import { ElMessage, ElMessageBox } from 'element-plus'
	import Bus from "../../../utils/bus";

	const { proxy } = getCurrentInstance() as any;
    let selectionGroups: Department[] = [];
    let msg: any = null;
    const dialogVisible = ref(false);
    const isSaveLoading = ref(false);
	
	Bus.on('add-data-form', (flag: any) =>{
		if (flag) {
			// todo:点击添加数据集之后，这里是不是要动态获取最新数据集列表
			dialogVisible.value = true
		}
	})

	const tableConfig = reactive({
        'searchConfig': {
			'searchForms': [
				{
					'type': `search`,
					'label': ``,
					'prop': `keyword`
				}
			]
		},
		'tableHeader': [
            {
				'label': `数据集摘要`,
				'prop': `zhaiyao`
			},
			{
				'label': `数据提供方`,
				'prop': `source`
			},
			{
				'label': `数据控制方`,
				'prop': `kongfang`
			},
			// {
			// 	'label': `类型`,
			// 	'prop': `type`,
			// 	'innerHTML': (row: any) => {
			// 		return `<span>${ row.type === 0 ? '钢' : '铁' }</span>`
			// 	}
			// },
            {
				'label': `描述`,
				'prop': `desc`
			},
		]
	});
    const searchCallback = (params: any) => {
        	return {
			"success": true,
			"message": "string",
			"content": {
				"size": 0,
				"records": [
					{
						'id': 1,
                        'zhaiyao': "热轧带肋钢筋生产线",
                        'source': "北京万润利达钢铁有限公司",
                        'kongfang': "北京万润利达钢铁有限公司",
                        'desc': "该数据集包含所有热轧带肋钢筋生产线的评价",
					},
                    {
						'id': 2,
                        'zhaiyao': "热轧带肋钢筋生产线",
                        'source': "北京万润利达钢铁有限公司",
                        'kongfang': "北京万润利达钢铁有限公司",
                        'desc': "该数据集包含所有热轧带肋钢筋生产线的评价",
					},
                    {
						'id': 3,
                        'zhaiyao': "热轧带肋钢筋生产线",
                        'source': "北京万润利达钢铁有限公司",
                        'kongfang': "北京万润利达钢铁有限公司",
                        'desc': "该数据集包含所有热轧带肋钢筋生产线的评价",
					},
                    {
						'id': 4,
                        'zhaiyao': "热轧带肋钢筋生产线",
                        'source': "北京万润利达钢铁有限公司",
                        'kongfang': "北京万润利达钢铁有限公司",
                        'desc': "该数据集包含所有热轧带肋钢筋生产线的评价",
					}
				],
				"current": 0,
				"pages": 0,
				"total": 0
			},
			"options": {
				"additionalProp1": {},
				"additionalProp2": {},
				"additionalProp3": {}
			}
		}
    };
    // 勾选事件
	const groupSelectionChange = (values: Department[]) => {
		selectionGroups = values;
	};

	// 保存
	const onSave = async () => {
		if (selectionGroups?.length > 0) {
			try {
				await proxy
					.$confirm(`此操作将添加选中的${selectionGroups.length}个数据, 是否继续?`, `提示`, {
						'confirmButtonText': `确定`,
						'cancelButtonText': `取消`,
						'type': `warning`
					})
					.then(async () => {
						ElMessage({
							type: 'success',
							message: '添加成功',
						})
						dialogVisible.value = false
						const submitData = selectionGroups.map((item: Department) => ({ 'id': item.id }));
						const res = await delDepartmentList(submitData);
						res.success && proxy.$message.success(`添加成功`);
					});
			} catch (error) {
				return Promise.reject(new Error(`cancel`));
			}
		} else {
			msg?.close();
			msg = proxy.$message.warning(`请勾选需要添加的数据`);
			return Promise.reject(new Error(`cancel`));
		}
	};

	const created = async () => {
	};
    //搜索事件
    // const searchCallback = (params: any) => gradeApplyPage(params);
	created();
</script>
<style scoped lang="scss">
	.dataForm {
		.btns {
			padding-bottom: 20px;
            text-align: right;
		}
	}
    ::v-deep .customTable .top{
        justify-content: end;
    }
</style>
